<%@page import="br.unirio.userlogging.LoggingServices"%>
<%@page import="br.unirio.userlogging.GenericUser"%>
<%@page import="br.unirio.dsw.modelo.Usuario" %>
<%@ page import="java.util.List" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="s" uri="/struts-tags" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>
<%@ taglib uri="/WEB-INF/tld/user.tld" prefix="login" %>
<%
	response.setHeader ("Cache-Control", "no-cache");
	response.setHeader ("Pragma", "no-cache");
	response.setDateHeader ("Expires", 0); 
%>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:fb="http://www.facebook.com/2008/fbml" xml:lang="en" lang="en">
<head>
<title>CD Bay</title>
<meta name="author" content="Felipe Leão (felipe.leao@uniriotec.br)">
<meta name="author" content="Talles Santana (talles.santana@uniriotec.br)">
<META NAME="description" CONTENT="CD Bay - Unindo você a trilha sonora da sua vida">





<!--
//////////////////////////////////////////////////////////////////////////
// 						IMPORTS CSS, JS, FAVICON 						//
//////////////////////////////////////////////////////////////////////////
 -->




<!-- FAVICON -->
<link rel="SHORTCUT ICON" href="/LojaWeb/images/favicon.jpg">



<!-- CSS Loja -->
<link rel="stylesheet" href="<%=request.getContextPath()%>/css/loja_web.css">
<!-- CSS JQuery UI -->
<link type="text/css" href="<%=request.getContextPath()%>/css/humanity/jquery-ui-1.8.13.custom.css" rel="stylesheet" />	
<link type="text/css" href="<%=request.getContextPath()%>/css/jquery.ui.all.css" rel="stylesheet" />	
<!-- CSS DataTables -->
<style type="text/css" title="currentStyle"> 
	@import "css/datatables/cssfiles/demo_page.css";
	@import "css/datatables/cssfiles/demo_table_jui.css";
	@import "css/datatables/theme_smoothness/jquery-ui-1.8.4.custom.css";
</style>




<!-- JQuery UI -->
<script type="text/javascript" src="<%=request.getContextPath()%>/js/jquery-1.5.1.min.js"></script>
<script type="text/javascript" src="<%=request.getContextPath()%>/js/jquery-ui-1.8.13.custom.min.js"></script>

<!-- DataTables JQuery -->
<script type="text/javascript" language="javascript" src="<%=request.getContextPath()%>/js/jquery.dataTables.js"></script>

<!-- Reflection JQuery -->
<script type="text/javascript" language="javascript" src="<%=request.getContextPath()%>/js/reflection.js"></script> 

<!-- JQueryForm e Interface -->
<script type="text/javascript" language="javascript" src="<%=request.getContextPath()%>/js/jquery.form.js"></script> 
<script type="text/javascript" language="javascript" src="<%=request.getContextPath()%>/js/interface.js"></script> 

<!-- JQueryHint -->
<script type="text/javascript" language="javascript" src="<%=request.getContextPath()%>/js/jquery.hint.js"></script> 
<script type="text/javascript" language="javascript">
	$(function(){ 
	    // find all the input elements with title attributes
		$('input[title!=""]').hint();
	});
</script>

</head>



<!--
//////////////////////////////////////////////////////////////////////
// 								BODY		 						//
//////////////////////////////////////////////////////////////////////
 -->


<body>

<table width="942" border="0" cellpadding="0" cellspacing="0" align="center">
	<tr>
		<td colspan="2" rowspan="4">
			<a href="inicio.action"
				onmouseover="window.status='Retornar a Página Inicial';  return true;"
				onmouseout="window.status='';  return true;">
				<img src="/LojaWeb/images/logotipo.jpg" width="241" height="81" border="0" alt=""></a></td>
		<td colspan="5" width="701" height="32" id="area_usuario">
			<p>  
				<login:checkLogged>
				  <span class="horalogin">Login em <fmt:formatDate pattern="dd/MM" type ="date"  value="${sessionScope.data}" />
				  às  <fmt:formatDate pattern="HH:mm" type ="time"  value="${sessionScope.data}" /></span>
				</login:checkLogged>
				<%
				LoggingServices.getInstance().logUser(pageContext, (GenericUser) session.getAttribute("usuario")); %>
				<login:checkLogged>
					<img src="/LojaWeb/images/estrela.png">Olá <a href="<s:url action="exibirUsuario" ><s:param name="idUsuario" value="#session.usuario.id"/> </s:url>"/> <c:out value="${sessionScope.usuario.nome}" /> </a>
					  |  
					<a href="<%=request.getContextPath()%>/pages/alterarSenha.jsp" >Alterar Senha</a>
					  |  
					<a href="<s:url action="logout"/>">Logout  <img src="/LojaWeb/images/logout.png"></a>
				</login:checkLogged>
	
				<login:checkUnlogged>
					<a href="<%=request.getContextPath()%>/pages/cadastroUsuario.jsp">Criar Conta</a>	
					 |  
					<a href="<%=request.getContextPath()%>/pages/login.jsp">Login</a>
				</login:checkUnlogged>		
			</p>
			
		</td>
	</tr>
	<tr>
		<td colspan="5" width="701" height="12"></td>
	</tr>
	<tr>
		<td colspan="2" rowspan="2" width="348" height="37"></td>
		<td width="350" height="22">
			<s:form action="pesquisarAlbumEArtista">
				<input type="text" title="<s:text name="pesquisar.campo.busca"/>" id="pesquisarAlbumCampo" name="campoBusca" class="campo_busca">
				<input type="submit" value="<s:text name="pesquisar.botao"/>" id="pesquisarAlbumSubmit" class="botao_busca">
			</s:form>
		</td>
		<td colspan="2" rowspan="2" width="3" height="37"></td>
	</tr>
	<tr>
		<td width="350" height="15"></td>
	</tr>
	<tr>
		<td rowspan="4" bgcolor="#bcbcbd"></td>
		<td colspan="5" width="940" height="7"></td>
		<td rowspan="4" bgcolor="#bcbcbd"></td>
	</tr>
	<tr>
		<td id="nav_bar">
			<p class="navbar_title"><img src="/LojaWeb/images/icone_cd.jpg"> Estilos Musicais</p>
	<p>
	<% List lista = (List) getServletContext().getAttribute("lista"); 
		if(lista != null){
			request.setAttribute("listaEstilosRoot", lista);
		}
	%>
		
		<ul class="estilos_musicais">
			<s:iterator value="#request.listaEstilosRoot">
				<s:url id="escolherEstilo" action="listarSubEstilos"><s:param name="idEstiloPai"><s:property value="id"/></s:param></s:url>
				<li><a href="<s:property value="escolherEstilo"/>" ><s:property value="nome" /></a></li>
			</s:iterator>
		</ul>
	</p>
		</td>
		<td bgcolor="#bcbcbd"></td>
		<td colspan="3" id="conteudo">